<template>
<div class="add">
  <van-nav-bar title="添加产品" left-div="返回" left-arrow @click-left="onClickLeft" fixed />
  <van-form @submit="onSubmit">
    <van-field name="uploader" label="产品图上传">
      <template #input>
        <van-uploader v-model="uploader" />
      </template>
    </van-field>
    <van-field v-model="username" name="名称" label="名称" placeholder="名称" />
    <van-field v-model="username" name="产地" label="产地" placeholder="产地" />
    <van-field v-model="username" name="联系人" label="联系人" placeholder="联系人" />
    <van-field v-model="username" name="联系手机" label="联系手机" placeholder="联系手机" />
    <van-field v-model="message" rows="2" autosize label="产品介绍" type="divarea" maxlength="50" placeholder="请输入产品介绍" show-word-limit />
  </van-form>
  <div style="margin:30px;">
    <van-button round block plain type="primary" native-type="submit">保存</van-button>
  </div>
</div>
</template>

<script>
export default {
  name: 'productAdd',
  data() {
    return {
      uploader: [{
        url: 'https://img01.yzcdn.cn/vant/leaf.jpg'
      }],
    };
  },
  methods: {
    onClickLeft() {
      this.$router.push({
        name: 'product'
      })
    },
  },
}
</script>

<style scoped>
.add {
  margin-top: 46px;
  position: absolute;
  width: 375px;
  background: linear-gradient(0deg, rgba(194, 228, 253, 0) 0%, #dcfad6 56%, #c2f3c9 100%);
}


.content-tips {
  font-size: 12px;
  font-weight: 400;
  margin-top: 16px;
  margin-bottom: 8px;
  line-height: 14px;
  color: #ffffff;
}
</style>
